<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="css/style.css"/>
<link href="assets/css/codemirror.css" rel="stylesheet">
<link rel="stylesheet" href="assets/css/ace.min.css" />
<link rel="stylesheet" href="font/css/font-awesome.min.css" />
<!--[if lte IE 8]>
		  <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
		<![endif]-->
<script src="js/jquery-1.9.1.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/typeahead-bs2.min.js"></script>
<script src="assets/js/jquery.dataTables.min.js"></script>
<script src="assets/js/jquery.dataTables.bootstrap.js"></script>
<script src="assets/layer/layer.js" type="text/javascript" ></script>
<script src="assets/laydate/laydate.js" type="text/javascript"></script>
<script src="js/lrtk.js" type="text/javascript" ></script>
<title>培训记录</title>
</head>
<body>
<div class="clearfix">
  <div class="handling_style" id="order_hand">
    <div id="scrollsidebar" class="left_Treeview">
      <div class="show_btn" id="rightArrow"><span></span></div>
      <div class="widget-box side_content" >
        <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
        <div class="side_list">
          <div class="widget-header header-color-green2">
            <h4 class="lighter smaller">培训项目</h4>
          </div>
          <div class="widget-body">
            <ul class="b_P_Sort_list">
              <li><i class="fa fa-sticky-note pink "></i> <a href="#">.net编程(1)</a></li>
              <li><i class="fa fa-sticky-note pink "></i> <a href="#">C#编程(2)</a> </li>
              <li><i class="fa fa-sticky-note pink "></i> <a href="#">C++编程(0)</a></li>
              <li><i class="fa fa-sticky-note pink "></i> <a href="#">Java编程(2)</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="order_list_style" id="order_list_style">
      <div class="search_style">
        <ul class="search_content clearfix">
          <li>
            <label class="l_f">培训项目</label>
            <input name="" type="text" class="text_add" placeholder="培训项目" style=" width:250px">
          </li>
          <li>
            <label class="l_f">培训开始时间</label>
            <input class="inline laydate-icon" id="start" style=" margin-left:10px;">
          </li>
          <li style="width:90px;">
            <button type="button" class="btn_search"><i class="fa fa-search"></i>查询</button>
          </li>
        </ul>
      </div>
	   <!---->
     <div class="border clearfix">
       <span class="l_f">
        <a href="javascript:;" id="property_add" class="btn btn-warning"><i class="icon-plus"></i>添加培训记录</a>
       </span>
     </div>
     <!---->
      <!--交易订单列表-->
      <div class="Orderform_list">
        <table class="table table-striped table-bordered table-hover" id="sample-table">
          <thead>
            <tr>
              <th width="80px">序号</th>
              <th width="120px">员工编号</th>
              <th width="120px">员工名称</th>
              <th width="100px">培训项目</th>
              <th width="100px">开始培训时间</th>
              <th width="100px">预计结束时间</th>
			  <th width="100px">实际结束时间</th>
              <th width="120px">所属部门</th>
              <th width="100px">现处状态</th>
              <th width="200px">操作</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>12142</td>
              <td class="order_product_name">张三</td>
              <td>Java</td>
              <td>2016-2-1</td>
              <td>2016-7-5</td>
              <td></td>
              <td>开发部</td>
              <td class="td-status"><span class="label label-success radius">培训中</span></td>
              <td><a onClick="member_stop(this,'10001')"  href="javascript:;" title="修改状态"  class="btn btn-xs btn-success"><i class="fa fa-check  bigger-120"></i></a> 
			  <a  title="培训详情"  class="btn btn-xs btn-info  property_edit"><i class="fa fa-edit  bigger-120"></i></a></td>
            </tr>
            <tr>
              <td>2</td>
              <td>15243</td>
              <td class="order_product_name">李四</td>
              <td>Java</td>
              <td>2016-2-1</td>
              <td>2016-7-5</td>
              <td></td>
              <td>开发部</td>
              <td class="td-status"><span class="label label-success radius">培训中</span></td>
              <td><a onClick="member_stop(this,'10001')"  href="javascript:;" title="修改状态"  class="btn btn-xs btn-success"><i class="fa fa-check  bigger-120"></i></a> 
			  <a  title="培训详情"  class="btn btn-xs btn-info  property_edit"><i class="fa fa-edit  bigger-120"></i></a></td>
            </tr>
            <tr>
              <td>3</td>
              <td>15236</td>
              <td class="order_product_name">王五</td>
              <td>C#</td>
              <td>2016-2-1</td>
              <td>2016-7-5</td>
              <td></td>
              <td>开发部</td>
              <td class="td-status"><span class="label label-success radius">培训中</span></td>
              <td><a onClick="member_stop(this,'10001')"  href="javascript:;" title="修改状态"  class="btn btn-xs btn-success"><i class="fa fa-check  bigger-120"></i></a> 
			  <a  title="培训详情"  class="btn btn-xs btn-info  property_edit"><i class="fa fa-edit  bigger-120"></i></a></td>
            </tr>
            <tr>
              <td>4</td>
              <td>15232</td>
              <td class="order_product_name">赵六</td>
              <td>C#</td>
              <td>2016-2-1</td>
              <td>2016-7-5</td>
              <td>2016-7-5</td>
              <td>开发部</td>
              <td class="td-status"><span class="label label-defaunt radius">已结束</span></td>
              <td>
			  <a  title="培训详情" id="xiangqing"  class="btn btn-xs btn-info "><i class="fa fa-list  bigger-120"></i></a> </td>
            </tr>
            <tr>
              <td>5</td>
              <td>15362</td>
              <td class="order_product_name">徐七</td>
              <td>.net</td>
              <td>2016-2-1</td>
              <td>2016-7-5</td>
              <td></td>
              <td>开发部</td>
              <td class="td-status"><span class="label label-success radius">培训中</span></td>
              <td><a onClick="member_stop(this,'10001')"  href="javascript:;" title="修改状态"  class="btn btn-xs btn-success"><i class="fa fa-check  bigger-120"></i></a> 
			  <a  title="培训详情"  class="btn btn-xs btn-info  property_edit"><i class="fa fa-edit  bigger-120"></i></a></td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
<!--销售区域分配图层-->
<div class="add_menber" id="add_menber_style" style="display:none">
  <ul class=" page-content">
    <div class="Operate_cont clearfix">
      <label class="form-label"><span class="c-red">*</span>员工编号：</label>
      <div class="formControls " style="width:280px;">
         <input type="text" class="input-text" value="" placeholder="" id="user-name" name="员工编号">
      </div>
    </div>
    <div class="Operate_cont clearfix">
      <label class="form-label"><span class="c-red">*</span>员工名称：</label>
      <div class="formControls ">
        <input type="text" class="input-text" value="" placeholder="" id="user-name" name="员工名称">
      </div>
    </div>
    <div class="Operate_cont clearfix">
      <label class="form-label"><span class="c-red">*</span>培训项目：</label>
      <div class="formControls ">
        <select id="select_id" name="sheng"  style="margin-left:10px;">
		<option value="张三">请选择培训项目</option>
          <option value="张三">Java编程</option>
          <option value="张三">.net编程</option>
          <option value="张三">C#编程</option>
        </select>
      </div>
    </div>
    <div class="Operate_cont clearfix">
      <label class="form-label"><span class="c-red">*</span>开始培训时间：</label>
      <div class="formControls "><input class="inline laydate-icon" id="start2" name="开始培训时间" style=" margin-left:10px;">
      </div>
    </div>
	<div class="Operate_cont clearfix">
      <label class="form-label"><span class="c-red">*</span>预计结束时间：</label>
      <div class="formControls "><input class="inline laydate-icon" id="start3"  name="预计结束时间" style=" margin-left:10px;">
      </div>
    </div>
    <div class="Operate_cont clearfix">
      <label class="form-label"><span class="c-red"></span>培训部门：</label>
      <div class="formControls ">
        <select id="select_id" name="sheng"  style="margin-left:10px;">
		<option value="张三">请选择培训部门</option>
          <option value="张三">开发部</option>
          <option value="张三">销售部</option>
        </select>
      </div>
    </div>
  </ul>
</div>
</div>
</div>
</div>
<!--编辑区域分配图层-->
<div class="edit_menber" id="edit_menber_style" style="display:none">
  <ul class=" page-content">
    <div class="Operate_cont clearfix">
	 <div class="brand_detailed">
    <ul class="Info_style clearfix" style="width:510px; margin-top:0px;">
		<li><label class="label_name">员工编号：</label> <span class="name">0142</span></li>
		<li><label class="label_name">员工名称：</label><span class="name">张三</span></li>
		<li><label class="label_name">培训项目：</label> <span class="name">Java</span></li>
		<li><label class="label_name">培训部门：</label><span class="name">开发部</span></li>
		<li><label class="label_name" style="width:100px;">开始培训时间：</label><span class="name">2016-12-1</span></li>
		<li><label class="label_name" style="width:100px;">预计结束时间：</label><span class="name">2017-3-1</span></li>
		
        <li style="width:550px;" class="b_Introduce"><label class="label_name">培训记录：</label><span class="name"> </span></li>
		<li style="width:550px;height:200px;">
			<div class="Operate_cont clearfix" style="width:530px;">
				<div class="brand_info clearfix">
					<div class="title_brand">2016-12-01</div>
					<ul class="Info_style clearfix" style="width:100%;">
						<li><label class="label_name">培训地点：</label> <span class="name">10#102室</span></li>
						<li><label class="label_name">讲师：</label> <span class="name">李四</span></li>
						<li><label class="label_name">培训内容：</label><span class="name">计算机编程</span></li>
					</ul>
				</div>
			</div>
		</li>
		<li style="width:550px;"><label class="label_name">培训时间：</label><span class="name"><input type="text" id="start1" class="inline laydate-icon input-text" style="width:130px;" name="培训时间"></span></li>
		<li><label class="label_name">培训地点：</label><span class="name"><input type="text" class="input-text" style="width:130px;"  name="培训地点"></span></li>
		<li><label class="label_name">讲师：</label><span class="name"><input type="text" class="input-text" style="width:130px;"  name="讲师"></span></li>
		<li style="width:550px;"><label class="label_name">培训内容：</label><span class="name"><textarea cols="50" rows="5"></textarea></span></li>
    </ul>
 </div>
</div>
</ul>
</div>
<!--编辑区域分配图层-->
<div class="list_menber" id="list_menber_style" style="display:none">
  <ul class=" page-content">
    <div class="Operate_cont clearfix">
	 <div class="brand_detailed">
    <ul class="Info_style clearfix" style="width:510px; margin-top:0px;">
		<li><label class="label_name">员工编号：</label> <span class="name">0142</span></li>
		<li><label class="label_name">员工名称：</label><span class="name">张三</span></li>
		<li><label class="label_name">培训项目：</label> <span class="name">Java</span></li>
		<li><label class="label_name">培训部门：</label><span class="name">开发部</span></li>
		<li><label class="label_name" style="width:100px;">开始培训时间：</label><span class="name">2016-12-1</span></li>
		<li><label class="label_name" style="width:100px;">预计结束时间：</label><span class="name">2017-3-1</span></li>
		
        <li style="width:550px;" class="b_Introduce"><label class="label_name">培训记录：</label><span class="name"> </span></li>
		<li style="width:550px;height:200px;">
			<div class="Operate_cont clearfix" style="width:530px;">
				<div class="brand_info clearfix">
					<div class="title_brand">2016-12-01</div>
					<ul class="Info_style clearfix" style="width:100%;">
						<li><label class="label_name">培训地点：</label> <span class="name">10#102室</span></li>
						<li><label class="label_name">讲师：</label> <span class="name">李四</span></li>
						<li><label class="label_name">培训内容：</label><span class="name">计算机编程</span></li>
					</ul>
				</div>
			</div>
		</li>
    </ul>
 </div>
</div>
</ul>
</div>
</body>
</html>
<script>
/*区域分配-添加*/
$(function(){
//时间
 laydate({
    elem: '#start',
    event: 'focus' 
});
laydate({
    elem: '#start1',
    event: 'focus' 
});
laydate({
    elem: '#start2',
    event: 'focus' 
});
laydate({
    elem: '#start3',
    event: 'focus' 
});
});
 $('#property_add').on('click', function(){
    layer.open({
        type: 1,
        title: '添加员工培训',
		maxmin: true, 
		shadeClose: true, //点击遮罩关闭层
        area : ['600px' , ''],
        content:$('#add_menber_style'),
		btn:['提交','取消'],
		yes:function(index,layero){	
		 var num=0;
		 var str="";
     $(".add_menber input[type$='text']").each(function(n){
          if($(this).val()=="")
          {
               
			   layer.alert(str+=""+$(this).attr("name")+"不能为空！\r\n",{
                title: '提示框',				
				icon:0,								
          }); 
		    num++;
            return false;            
          } 
		 });
		  if(num>0){  return false;}	 	
          else{
			  layer.alert('添加成功！',{
               title: '提示框',				
			icon:1,		
			  });
			   layer.close(index);	
		  }		  		     				
		}
    });
});
/*区域分配-编辑*/
 $('.property_edit').on('click', function(){
	  layer.open({
        type: 1,
        title: '编辑员工培训',
		maxmin: true, 
		shadeClose:false, //点击遮罩关闭层
        area : ['600px' , '600px'],
        content:$('#edit_menber_style'),
		btn:['保存','取消'],
		yes:function(index,layero){	
		 var num=0;
		 var str="";
     $(".edit_menber input[type$='text']").each(function(n){
          if($(this).val()=="")
          {
               
			   layer.alert(str+=""+$(this).attr("name")+"不能为空！\r\n",{
                title: '提示框',				
				icon:0,								
          }); 
		    num++;
            return false;            
          } 
		 });
		  if(num>0){  return false;}	 	
          else{
			  layer.alert('修改成功！',{
               title: '提示框',				
			icon:1,		
			  });
			   layer.close(index);	
		  }		  		     				
		}
    });
});
 $('#xiangqing').on('click', function(){
	  layer.open({
        type: 1,
        title: '员工培训详情',
		maxmin: true, 
		shadeClose:false, //点击遮罩关闭层
        area : ['600px' , '600px'],
        content:$('#list_menber_style'),
		btn:['返回'],
		yes:function(index,layero){	
		 var num=0;
		 var str="";
     $(".list_menber input[type$='text']").each(function(n){
          if($(this).val()=="")
          {
               
			   layer.alert(str+=""+$(this).attr("name")+"不能为空！\r\n",{
                title: '提示框',				
				icon:0,								
          }); 
		    num++;
            return false;            
          } 
		 });
		  if(num>0){  return false;}	 	
          else{
			   layer.close(index);	
		  }		  		     				
		}
    });
});
$(function() { 
	$("#order_hand").fix({
		float : 'left',
		//minStatue : true,
		skin : 'green',	
		durationTime :false,
		spacingw:30,//设置隐藏时的距离
	    spacingh:250,//设置显示时间距
		table_menu:'.order_list_style',
	});
});



//初始化宽度、高度  
 $(".widget-box").height($(window).height()); 
$(".order_list_style").width($(window).width()-220);
 $(".order_list_style").height($(window).height()-30);
  //当文档窗口发生改变时 触发  
    $(window).resize(function(){
	$(".widget-box").height($(window).height());
	 $(".order_list_style").width($(window).width()-234);
	  $(".order_list_style").height($(window).height()-30);
});
/*状态-结束*/
function member_stop(obj,id){
	layer.confirm('确认修改状态为已结束？',function(index){
		$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,id)" href="javascript:;" title="进行中"><i class="fa fa-close bigger-120"></i></a>');
		$(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已结束</span>');
		$(obj).remove();
		layer.msg('已结束!',{icon: 5,time:1000});
	});
}


/*人员-删除*/
function Order_form_del(obj,id){
	layer.confirm('确认要删除吗？',function(index){
		$(obj).parents("tr").remove();
		layer.msg('已删除!',{icon:1,time:1000});
	});
}
function xiangqing(){
	document.getElementById("peixun").style.display="none";
}
//订单列表
jQuery(function($) {
		var oTable1 = $('#sample-table').dataTable( {
		"aaSorting": [[ 1, "desc" ]],//默认第几个排序
		"bStateSave": true,//状态保存
		"aoColumnDefs": [
		  //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
		  {"orderable":false,"aTargets":[2,3,4,5,6,7,8]}// 制定列不参与排序
		] } );
                 //全选操作
				$('table th input:checkbox').on('click' , function(){
					var that = this;
					$(this).closest('table').find('tr > td:first-child input:checkbox')
					.each(function(){
						this.checked = that.checked;
						$(this).closest('tr').toggleClass('selected');
					});
						
				});
			});
</script>
